<template>
	<view class="set-content" @click="handlerItem('name')">
		<view class="set-content-left"> 设备名称 </view>
		<view class="set-content-right">
			<view class="">
				{{ deviceName}}
			</view>
			<view class="set-content-right-icon">
				<up-icon name="arrow-right"></up-icon>
			</view>
		</view>
	</view>
	<view class="set-content">
		<view class="set-content-left"> 设备类型 </view>
		<view class="set-content-right">
			<view class="">
				<text v-if="details.devType == '1'"> LORA款</text>
				<text v-if="details.devType == '2'"> 485 款</text>
				<text v-if="details.devType == '3'"> 4G电量款</text>
			</view>
			<view class="set-content-right-icon"> </view>
		</view>
	</view>
	<view class="set-content" @click="handlerItem('equipNo')">
		<view class="set-content-left"> 序列号 </view>
		<view class="set-content-right">
			<view class="" v-show="details.equipNo">
				{{ details.equipNo }}
			</view>
			<view class="set-content-right-icon"> </view>
		</view>
	</view>
	<view class="set-content">
		<view class="set-content-left"> 软件版本 </view>
		<view class="set-content-right">
			<view class="" v-show="details.gwVersion">
				{{ details.gwVersion }}
			</view>
			<view class="set-content-right-icon"> </view>
		</view>
	</view>
	<view class="set-content">
		<view class="set-content-left"> 信号强度 </view>
		<view class="set-content-right">
			<view class="" v-show="details.devRssi">
				{{ details.devRssi }}
			</view>
			<view class="set-content-right-icon"> </view>
		</view>
	</view>
	<view class="set-content" @click="handlerItem('share')">
		<view class="set-content-left"> 设备共享 </view>
		<view class="set-content-right">
			<view class=""> </view>
			<view class="set-content-right-icon">
				<up-icon name="arrow-right"></up-icon>
			</view>
		</view>
	</view>
	<view class="set-content">
		<view class="set-content-left"> 地温 </view>
		<view class="set-content-right">
			<view class="">
				{{groundTemp}}
			</view>
			<view class="set-content-right-icon">

			</view>
		</view>
	</view>

	<view class="set-content" @click="handlerItem('worktype')">
		<view class="set-content-left"> 工作类型 </view>
		<view class="set-content-right">
			<view class=""> {{ workTypeName }}</view>
			<view class="set-content-right-icon">
				<up-icon name="arrow-right"></up-icon>
			</view>
		</view>
	</view>
	<!-- 	<view class="set-content" @click="handlerItem('backend')">
		<view class="set-content-left"> 后台配置 </view>
		<view class="set-content-right">
			<view class=""></view>
			<view class="set-content-right-icon">
				<up-icon name="arrow-right"></up-icon>
			</view>
		</view>
	</view> -->
	<view class="set-content" @click="handlerItem('params')" v-if="paramsShow">
		<view class="set-content-left"> 高级参数 </view>
		<view class="set-content-right">
			<view class=""> </view>
			<view class="set-content-right-icon">
				<up-icon name="arrow-right"></up-icon>
			</view>
		</view>
	</view>
	<!-- <view class="set-content" @click="handlerItem('upGrade')">
		<view class="set-content-left">
			固件升级</view>
		<view class="set-content-right">
			<view class="">

			</view>
			<view class="set-content-right-icon">
				<up-icon name="arrow-right"></up-icon>
			</view>
		</view>
	</view> -->

	<!-- <view class="set-content">
		<view class="set-content-left">
			安全设置</view>
		<view class="set-content-right">
			<view class="">

			</view>
			<view class="set-content-right-icon">
				<up-icon name="arrow-right"></up-icon>
			</view>
		</view> -->

	<!-- </view> -->
	<!-- <view class="set-content" @click="handlerItem('storageSet')">
		<view class="set-content-left">
			人存设置</view>
		<view class="set-content-right">
			<view class="">

			</view>
			<view class="set-content-right-icon">
				<up-icon name="arrow-right"></up-icon>
			</view>
		</view>

	</view> -->
	<!-- <view class="set-content">
		<view class="set-content-left">
			帮助与反馈</view>
		<view class="set-content-right">
			<view class="">

			</view>
			<view class="set-content-right-icon">
				<up-icon name="arrow-right"></up-icon>
			</view>
		</view>

	</view> -->
	<!-- <view class="set-content" @click="handlerItem('repairFault')">
		<view class="set-content-left">
			故障报修</view>
		<view class="set-content-right">
			<view class="">

			</view>
			<view class="set-content-right-icon">
				<up-icon name="arrow-right"></up-icon>
			</view>
		</view>

	</view> -->
	<!-- <view class="set-content">
		<view class="set-content-left">
			4G流量
		</view>
		<view class="set-content-right">
			<view class="">

			</view>
			<view class="set-content-right-icon">
				<up-icon name="arrow-right"></up-icon>
			</view>
		</view>

	</view> -->

	<up-modal :show="showName" showCancelButton @cancel="closeModal" confirmColor="#25afe5" :closeOnClickOverlay="true"
		@confirm="confirmModal" :buttonReverse="true" @close="closeModal">
		<view class="">
			<view class="edit-device-name" style="display: flex; line-height: 40rpx; font-size: 26rpx">
				<view style="width: 120rpx; font-weight: 500">序列号:</view>
				{{ details.equipNo }}
			</view>
			<view style="display: flex; margin-top: 20rpx">
				<view class="" style="width: 120rpx; font-size: 24rpx; line-height: 70rpx">
					设备名称:
				</view>
				<view class="edit-device-name-input">
					<up-input v-model="newDevName" type="text" border="surround" />
					<view style="color: red; font-size: 22rpx; margin-top: 10rpx" v-show="newDevName == ''">
						设备名称不能为空
					</view>
				</view>
			</view>
		</view>
	</up-modal>
	<up-picker :defaultIndex="selected" v-model:show="show" :columns="workTypeList" keyName="dictLabel"
		valueName="dictValue" @close="handlcel" @cancle="handlcel" @confirm="handlconfirm"></up-picker>
</template>

<script setup>
	import {
		ref,
		nextTick
	} from "vue";
	import {
		onLoad,
	} from "@dcloudio/uni-app";
	import {
		useUserStore
	} from "@/store/user";

	// 获取store实例
	const userStore = useUserStore();
	const deviceId = ref("");
	const deviceName = ref("");
	const details = ref({});
	const newDevName = ref(""); //绑定的修改设备名
	const paramsShow = ref(false);
	const paramsCount = ref(0);
	const lastClickTime = ref(0);
	const CLICK_INTERVAL = 1000;
	const show = ref(false);
	const workTypeName = ref("");
	const selected = ref([]);
	const identity = ref(null)
	const groundTemp = ref(null)
	onLoad((options) => {
		let code = decodeURIComponent(options.equipNo);
		if (code) {
			deviceId.value = code;
			getDevInfo(deviceId.value);
		}

		identity.value = uni.getStorageSync("identity")
	});
	const showName = ref(false);
	const workTypeList = ref([]);
	const handlerItem = (val) => {
		if (identity.value == false) {
			// 0  解锁  1 锁后台  2 开放开关机 3 全锁
			if (details.value.devKeyLock == 1 || details.value.devKeyLock == 2 || details.value.devKeyLock == 3) {
				if (val == 'worktype') {
					uni.showToast({
						title: '设备已锁定,无法操作',
						icon: 'none'
					})
					return
				}
			}
		}
		switch (val) {
			case "name":
				newDevName.value = ''
				showName.value = true;
				newDevName.value = deviceName.value;
				break;
			case "share":
				uni.navigateTo({
					url: `/Device/DeviceShare/DeviceShare?id=${encodeURIComponent(
          details.value.id
        )}`,
				});
				break;
			case "upGrade":
				uni.navigateTo({
					url: "/Device/Upgrade/Upgrade",
				});
				break;
			case "storageSet":
				uni.navigateTo({
					url: `/Device/storageSet/storageSet?equipNo=${encodeURIComponent(
          details.value.equipNo
        )}&&id=${encodeURIComponent(details.value.id)}`,
				});
				break;
			case "repairFault":
				uni.navigateTo({
					url: "/Device/repairFault/repairFault",
				});
				break;
			case "params":
				uni.navigateTo({
					url: `/Device/AdvancedParameters/AdvancedParameters?id=${encodeURIComponent(
          details.value.id
        )}`,
				});
				break;
			case "equipNo":
				handleCount();
				break;
			case "worktype":
				show.value = true;
				break;
				// case "backend":
				// 	uni.navigateTo({
				// 		url: `/Device/BackendConfiguration/BackendConfiguration?id=${encodeURIComponent(
				// 	details.value.id)}`,
				// 	});
				// 	break;
			default:
				break;
		}
	};

	const handleCount = () => {
		const currentTime = new Date().getTime();

		if (currentTime - lastClickTime.value < CLICK_INTERVAL) {
			paramsCount.value++;
			if (paramsCount.value >= 3) {
				paramsShow.value = true;
				paramsCount.value = 0;
			}
		} else {
			// 不是连续点击，重置计数器
			paramsCount.value = 0;
		}
		// 更新上次点击时间
		lastClickTime.value = currentTime;
	};
	// 确认修改设备名称

	const getDevInfo = (devId) => {
		let data = {
			id: Number(devId) || Number(deviceId.value) || 728,
		};
		uni.$u.http.post("/wechat/getDevInfo", data).then((res) => {
			if (res.success) {
				details.value = res.data;

				deviceName.value = identity.value ? details.value.devName : details.value.devCustomName
				// workType = 1 || workType = 3时 32767/32768  显示 -- 
				if (details.value.workType == 1 || details.value.workType == 3) {
					if (details.value.devTemp2.includes('32768') || details.value.devTemp2.includes('32767')) {
						groundTemp.value = '--'
					} else if (details.value.devTemp2) {
						groundTemp.value = details.value.devTemp2 + '℃'
					} else {
						groundTemp.value = ''
					}
				}
				// workType = 1  时 32767 显示探头故障  32768  显示 --
				if (details.value.workType == 2) {
					if (details.value.devTemp2.includes('32768')) {
						groundTemp.value = '--'
					} else if (details.value.devTemp2.includes('32767')) {
						groundTemp.value = '探头故障'
					} else if (details.value.devTemp2) {
						groundTemp.value = details.value.devTemp2 + '℃'
					} else {
						groundTemp.value = ''
					}
				}
				if (details.value.workType == 4) {
					if (details.value.devTemp2.includes('32768') || details.value.devTemp2.includes('32767')) {
						groundTemp.value = '探头故障'
					} else if (details.value.devTemp2) {
						groundTemp.value = details.value.devTemp2 + '℃'
					} else {
						groundTemp.value = ''
					}
				}
				initWorkType();
			}
		});
	};
	// 弹窗确认按钮
	const confirmModal = () => {
		if (newDevName.value == "") {
			return;
		}
		let param = {
			equipNo: details.value.equipNo,
			devName: newDevName.value,
			devId: details.value.id,
		};
		let url = "";
		let identity = uni.getStorageSync("identity");
		//管理员和用户的路径动态
		if (identity) {
			url = "/wechat/editDevNameForItem";
			param.itemId = userStore.getItemId();
		} else {
			url = "/wechat/editDevName";
		}

		uni.$u.http.post(url, param).then((res) => {
			if (res.success) {
				uni.showToast({
					title: "修改成功",
					icon: "success",
				});
				deviceName.value = newDevName.value;
				showName.value = false;
			}
		});
	};

	const initWorkType = async () => {
		let res = await uni.$u.http.post("/wechat/getDataByDicType", {
			dictType: "sys_dn_workType",
		});

		workTypeList.value = [res.data];
		const workType = Number(details.value.workType);
		workTypeName.value =
			res.data.find((item) => String(item.dictValue) === String(workType))
			?.dictLabel || "";

		// 同样确保类型一致
		await nextTick();
		selected.value = [workType - 1];
	};
	const closeModal = () => {
		showName.value = false;
	};

	const handlcel = () => {
		show.value = false;
	};
	const handlconfirm = (e) => {
		selected.value = [e.value[0].dictSort - 1];
		let data = {
			id: details.value.id,
			equipNo: details.value.equipNo,
			workType: e.value[0].dictValue,
		};
		uni.$u.http.post("/wechat/editSend", data).then((res) => {
			if (res.success) {
				workTypeName.value = e.value[0].dictLabel;
			} else {
				uni.showToast({
					title: "修改失败",
					icon: "error"
				});
			}
		});
	};
</script>

<style lang="scss" scoped>
	.set-content {
		display: flex;
		justify-content: space-between;
		padding: 25rpx 0;
		margin: 0 40rpx;
		border-bottom: 1px solid #f5f5f5;
	}

	.set-content-right {
		display: flex;
		color: #797979;

		.set-content-right-icon {
			width: 40rpx;
			text-align: right;
			padding-left: 20rpx;
			padding-top: 5rpx;
		}
	}

	.set-content:last-child {
		border-bottom: none;
	}
</style>